INTRODUCING ARRAYS

OPENING QUESTION: We are all (I hope!) familiar with spreadsheets.

Spreadsheets hold data in an array.

How does that work? How many dimensions are present?

OBJECTIVES:  I will be able to create and load a one-dimensional array during today's class.

CALENDAR:

HELP FILES: I redid (?) the help video for using the APP Lab debugger, it is on our class slide deck and also HERE

WORK O' THE DAY

  • Before we get started today, let's review our Fire Drill Procedures from this class: If we do have an alert/alarm we'll head out to the hallway, take a right and then a LEFT through the double doors (don't go right, it gets VERY crowded)Then go along the sidewalk to the parking lot and find all the rest of Mr W's students (classes are arranged alphabetically by teacher!)
    ═══════════════════════════

INTRO:

Why are arrays such a good way to store data?

Programming-wise, there is a VERY big downside and a very BIG upside to using arrays...

Let us discuss

═══════════════════════════

You can (and probably should) think of an array as a single line in a spread sheet. Each 'cell' has a name that refers to that cell.

However, in an array we call the 'cell' an 'element' of that array. We refer to the element by the name of the array and position of that element in the array.

Let's say we have defined an array called 'numbers':

//Define an array named Numbers to have 10 items (elements)
var Numbers = [2, 4, 6, 8, 10, 12, 14, 16, 18, 20];

Notice that NAMING is key here!!!

It can be helpful to view that array as a line in a spreadsheet (as mentioned earlier):

2
4
6
8
10
12
14
16
18
20

Unlike a spreadsheet, however, we don't refer to rows/columns but rather the position in the array starting from 0:

numbers[1] = 4, numbers[7] = 16 etc...

It takes some time to get used to counting form 0 but you'll get comfy with it pretty quickly.

A final note, it can be SUPER helpful to know just how many elements there are in an array and sure enough, programming languages always give you a way to do that.

A common methold is the 'length' property.

The length of that array is found by:

numbers.length

 

ITERATING through an array is the PERFECT case for using a for loop:

for (let i = 0; i < numbers.length; i++){
console.log(numbers[i]);
}

Now let us take a gander at what Code.Org has to say about such things HERE (this video is a wee bit longer than usual...but that's ok)

Doing something just a tad bit different, I'd like you to work with a partner and remix the following code into your app lab, and write EXTENSIVE COMMENTS as to what is going on there as a learning exercise.

THere is a bug there, find it and fix it!

If you are already comfortable with arrays, do a wee bit of research, App Lab wise, and see how you would go about 'parsing' data. In otherwords, let's say you had the following data:

Frodo Baggins, 1234 Bagshot Row, Bag End, West Farthing, Shire

How might you go about loading that information into an array in JS such that each TYPE of data lands in a different cell

This article is a bit long winded but can be VERY helpful.

Let's take some sandbox time and regroup in about 30 minutes